<template>
	<div class="trainHeader">
		<div class="header">
			<header>
				<div class="trainHeader_return" @click="clickReturn" >
					<img src="../assets/film/fanhui@3x.png" alt=""/>
				</div>
				<div>{{name}}</div>
				<div class="trainHeader_btn" v-if="btn" @click="btnClick">{{btn}}</div>
			</header>
		</div>
		<div class="zhan"></div>
	</div>
</template>
<style scoped>
	.zhan {
		height: 88px;
	}
	/*导航栏*/
	.trainHeader > .header {
		position: fixed;
		top:0;
		left:0;
		z-index: 100;
		width: 100%;
	}
	
	.trainHeader header {
		width: 100%;
		height: 88px;
		display: flex;
		padding: 0 30px;
		justify-content: center;
		align-items: center;
		background-color: #fff;
		width: 100%;
		box-sizing: border-box;
		position: relative;
		top: 0;
		left: 0;
		font-size: 32px;
		color: #333;
	}
	
	.trainHeader_return {
		width: 25px;
		height: 100%;
		position: absolute;
		top: 0px;
		left: 30px;
		display: flex;
		align-items: center;
	}
	
	.trainHeader_return>img {
		width: 25px;
		height: 44px;
	}
	
	.trainHeader_btn {
		position: absolute;
		top: 0;
		right: 30px;
		height: 100%;
		display: flex;
		justify-content: flex-end;
		align-items: center;
		font-size: 30px;
		/*color: #333333;*/
		color: #3bc3c2;
	}
</style>
<style type="text/css">
	/*.train {
		touch-action: none;
	}*/
	body {
		background: #F4F5F9;
		
	}
</style>
<script>
	export default {
		name: "trainHeader",
		props: {
			name:String,
			btn:String,
		},
		data() { //数据
			return {

			}
		},
		mounted() {

		},
		created() {

		},
		methods: {
			clickReturn() {
				this._events.returnClick ? this.$emit('returnClick') : this.$router.back();
			},
			btnClick(){
				this.$emit('btnClick');
			},
		},
		components: {

		},
	};
</script>